<template>
  <!--表格-->
  <!--显示-->
  <div class="show-table">
    <table class="table-hover">
      <thead>
        <tr>
          <th v-for="(th,i) in title" :key="`th${i}`">
            {{th.fieldName}}{{$isEmpty(th.unit)?'':`(${th.unit})`}}<el-tooltip v-if="!$isEmpty(th.tips)" effect="dark" :content="th.tips" placement="top"><i class="fa fa-question-circle-o"></i></el-tooltip>
          </th>
        </tr>
      </thead>
      <tbody v-if="totalCount>0">
        <tr v-for="(tr,i) in tableDatas" :key="`tr${i}`">
          <td v-for="(td,index) in title" :key="`td${i}-${index}`"><form-item :item="handelCode(tr,td)"></form-item></td>
        </tr>
      </tbody>
    </table>
    <div class="no-data" v-if="totalCount===0">
      暂无数据！
    </div>
  </div>
</template>

<script>
import FormItem from "./FormItem";
import { GetTableData } from "./mixins.js";

export default {
  name: "TableItem",
  components: { FormItem },
  mixins: [GetTableData],
  computed: {
    title() {
      return this.fields.filter(function(item) {
        return !item.hidden;
      });
    }
  }
};
</script>
